<template>
	<view class="mainbgc">
		<!-- 自定义头部 -->
		<view class="header-top-box">
			<view class="header-top fff flexbetween">
				<view class="top-image" @click="gotoBack()"></view>
				<view class="searchinput flexleft">
					<view class="searchimg"></view>
					<input type="text" placeholder="请输入内容">
				</view>
				<view class="nostrongtext" style="margin-top: 20rpx;">搜索</view>
			</view>
		</view>
		<!-- 内容 -->
		<view class="zdymainpadding margin_top">
			<view class="ffffff paddingbom">
				<view class="flexbetween mainpadding">
					<view class="strongtext">线路1</view>
					<view class="rightlable radius">选择</view>
				</view>
				<u-collapse accordion :border="false">
					<u-collapse-item>
						<view slot="title" class="strongtext">海底捞</view>
						<!-- 右边图标 -->
						<view slot="right-icon" class="xialaicon"></view>
						<view class="flexbetween boxpadding" v-for="item in 5">
							<view class="strongtext">清汤蘸料</view>
							<view class="rightlable radius">选择</view>
						</view>
					</u-collapse-item>
				</u-collapse>
				<view class="flexbetween mainpadding">
					<view class="strongtext">线路1</view>
					<view class="rightlable radius">选择</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 1类别，2品牌，3单位
				listid:""
			}
		},
		onLoad(options) {
			this.listid = options.msg
		},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	// 顶部自定义
	.header-top-box {
		height: 170rpx;
		width: 100%;
	}

	.header-top {
		width: 100%;
		box-sizing: border-box;
		position: fixed;
		top: 0;
		left: 0;
		background-color: #fff;
		padding: 96rpx 40rpx 10rpx;
	}

	.top-image {
		margin-top: 20rpx;
		width: 20rpx;
		height: 38rpx;
		background: url('@/static/image/system/return.png') no-repeat;
		background-size: 20rpx 38rpx;
	}

	// 自定义顶部搜索
	.searchinput {
		margin-top: 20rpx;
		background-color: #f7f7f7;
		border-radius: 50rpx;
		padding: 12rpx 20rpx;
		input {
			width: 100%;
		}
	}

	.searchimg {
		width: 24rpx;
		height: 24rpx;
		background-image: url("@/static/image/system/search.png");
		background-size: 100% 100%;
		margin-right: 30rpx;
	}

	// 内容开始
	.zdymainpadding {
		padding: 30rpx 0 0 0;
	}

	.mainpadding2 {
		padding: 30rpx 30rpx 0 30rpx;
	}

	.paddingbom {
		padding-bottom: 30rpx;
	}

	.mainpadding:last-child {
		padding-bottom: 0;
	}

	.boxpadding {
		padding: 30rpx 0 30rpx 30rpx;
	}
</style>
